<template>

	<!-- <chat-suit-emoji id="chat-suit-emoji" bind:newEmojiStr="emojiAction"></chat-suit-emoji> -->
	<form class="text-input">

		<view class="f-row">
			<view class="v-record" @tap="toggleRecordModal">
				<image class="icon-record" src="/static/images/voice.png" style="height:30px; width: 30px;margin-left: 10px;">
				</image>
			</view>
				<input class="f news" type="text" cursor-spacing="100" confirm-type="send" v-model="inputMessage" @confirm="sendMessage"
				 @input="bindMessage" @tap="focus" @focus="focus" @blur="blur" :confirm-hold="isIPX ? true : false" placeholder="输入新消息"
				 placeholder-style="color:#CFCFCF ;padding-left:5px" v-if="jinyan==false"/>
				 <input class="f news" type="text" cursor-spacing="100" confirm-type="send" v-model="inputMessage" @confirm="sendMessage"
				  @input="bindMessage" @tap="focus" @focus="focus" @blur="blur" :disabled="true" :confirm-hold="isIPX ? true : false" placeholder="全员禁言"
				  placeholder-style="color:#CFCFCF ;padding-left:5px" style="text-align: center;" v-if="jinyan==true"/>
			<view class="open_emoji" @tap="openEmoji">
				<image src="/static/images/Emoji.png" style="height:25px; width: 25px" />
			</view>
			<view class="open_emoji" @tap="openadd" v-show="!inputMessage">
				<image src="/static/add.png" style="height:28px; width:28px" />
			</view>
			<button class="send-btn-style" hover-class='hover' @tap="sendMessage" v-show="inputMessage" style="font-size: 14px;">发送</button>
		</view>
	</form>
</template>

<script>
	let WebIM = require("../../../../../utils/WebIM")["default"];
	let msgType = require("../../../msgtype");
	let disp = require("../../../../../utils/broadcast");
	let msgStorage = require("../../../msgstorage");
	export default {
		data() {
			return {
				inputMessage: "",
				// render input 的值
				userMessage: "", // input 的实时值
				isIPX: false,
				jinyan:false,
			};
		},

		components: {},
		props: {
			username: {
				type: Object,
				default: () => ({}),
			},
			chatType: {
				type: String,
				default: msgType.chatType.SINGLE_CHAT,
			},
		},

		// lifetimes
		created() {
			 if(this.$store.state.searchKey.indexOf(this.username.groupId)==0){
			 	//本群禁言
			 	this.jinyan =true
			 }
			this.setData({
				isIPX: getApp().globalData.isIPX,
			});
		},
		beforeMount() {
		},
		moved() {},

		destroyed() {},

		mounted() {
		},
		methods: {
			//表情派发
			openEmoji(){
				if(this.jinyan==true){
					return
				}
				 this.$emit("pChangeType",1)
			},
			//语音派发
			toggleRecordModal(){
				if(this.jinyan==true){
					return
				}
				 this.$emit("pChangeType",2)
			},
			//展示底部
			openadd(){
				if(this.jinyan==true){
					return
				}
				this.$emit("pChangeType",3)
			},
			focus() {
				this.$emit("inputFocused", null, {
					bubbles: true,
				});
			},
			blur() {
				this.$emit("inputBlured", null, {
					bubbles: true,
				});
			},

			isGroupChat() {
				return this.chatType == msgType.chatType.CHAT_ROOM;
			},

			getSendToParam() {
				return this.isGroupChat() ? this.username.groupId : this.username.your;
			},

			// bindinput 不能打冒号！
			bindMessage(e) {
				this.setData({
					userMessage: e.detail.value,
				});
			},

			emojiAction(emoji) {
				var str;
				var msglen = this.userMessage.length - 1;

				if (emoji && emoji != "[del]") {
					str = this.userMessage + emoji;
				} else if (emoji == "[del]") {
					let start = this.userMessage.lastIndexOf("[");
					let end = this.userMessage.lastIndexOf("]");
					let len = end - start;

					if (end != -1 && end == msglen && len >= 3 && len <= 4) {
						str = this.userMessage.slice(0, start);
					} else {
						str = this.userMessage.slice(0, msglen);
					}
				}
				this.userMessage = str;
				this.inputMessage = str;
			},

			sendMessage() {
				let me = this;
				String.prototype.trim = function() {
					return this.replace(/(^\s*)|(\s*$)/g, "");
				};
				if (!this.userMessage.trim()) {
					return;
				}
				if (this.userMessage == '查我') {
					// console.log(this.chatType)
					console.log(this.username)
					let token = uni.getStorageSync("token")
					uni.request({
						url: this.G_base + '/api/lz/jfchaci',
						method: 'POST',
						header: {
							'content-type': 'application/x-www-form-urlencoded',
							'Authori-zation': 'Bearer ' + token
						},
						data: {
							qid: this.getSendToParam(),
							title: this.userMessage,
						},
						success: res => {
							console.log(res)
							if(res.data.status==400){
								uni.showToast({
									title:res.data.msg,
									icon:'none'
								})
							}
						}
					})
				}
				let id = WebIM.conn.getUniqueId();
				let msg = new WebIM.message(msgType.TEXT, id);
				msg.set({
					msg: this.userMessage,
					from: this.username.myName,
					to: this.getSendToParam(),
					roomType: false,
					chatType: this.chatType,
					success(id, serverMsgId) {
						console.log("成功了");
						console.log(msg)
						// 关闭表情弹窗
						me.$parent.cancelEmoji()
						disp.fire("em.chat.sendSuccess", id, me.userMessage);
					},
					fail(id, serverMsgId) {
						console.log("失败了");
					},
				});
				if (this.chatType == msgType.chatType.CHAT_ROOM) {
					msg.setGroup("groupchat");
				}
				try {
					WebIM.conn.send(msg.body);
					let obj = {
						msg: msg,
						type: msgType.TEXT,
					};
					this.saveSendMsg(obj);
				} catch (error) {
					console.log("error", error);
				}
				this.userMessage = "";
				this.inputMessage = "";
				uni.hideKeyboard();
			},

			saveSendMsg(evt) {
				msgStorage.saveMsg(evt.msg, evt.type);
			},
		},
	};
</script>
<style>
	@import "./main.css";
	.open_emoji{
		margin: 0 10px;
	}
</style>
